<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="s" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="<s:url value="/assets/web/css/base.css"></s:url>">
    <!-- bootstrap.min -->
    <link rel="stylesheet" href="<s:url value="/assets/web/css/login/bootstrap.min.css?v=3.3.6"></s:url>">
    <!-- tabs css -->
    <link rel="stylesheet" href="<s:url value="/assets/web/css/index/tabs.css"></s:url>">
    <!-- 图表页css    -->
    <link rel="stylesheet" href="<s:url value="/assets/web/css/index/index_chart.css"></s:url>">
    <title>重大项目节点管理系统</title>
</head>
<body>
<script type="text/javascript">

</script>
<!-- 头部信息 -->
<div class="header">
    <span class="big-title" style="margin-left:10px;">重大项目节点管理系统</span>
    <c:if test="${not empty sessionScope.user}">
        <%--<a class="setimg" href="<s:url value="/newlogin/gologin2"></s:url>"></a>--%>
        <a class="setimg" href="javascript:history.go(-1);"></a>
        <%--<span id="user-names">${sessionScope.user.name}</span>--%>
        <div class="btn-group operations">
            <a href="<s:url value="/test/getKLine"></s:url>">
                <button id="k_line" type="button" class="btn btn-primary">用时波动趋势</button>
            </a>
            <button id="user-names" type="button" class="btn btn-primary dropdown-toggle"
                    data-toggle="dropdown">
                    ${sessionScope.user.name}
            </button>
            <ul class="dropdown-menu" role="menu" style="min-width: 110px;">
                <li><a href="#" id="editPwd" data-toggle="modal" data-target="#update-password">修改密码</a></li>
                <li><a href="/newlogin/exit">退出登陆</a></li>
            </ul>
        </div>
    </c:if>

</div>
<!-- 内容主体 -->
<div class="page-content clear">
    <!-- 左侧栏 -基本情况 -->
    <div class="left-side lf">
        <div class="project-title  text-center">重大项目投资分类</div>
        <div class=" project-situation">
            <p>
                政府投资房建市政类：<em>${a1}项</em>
            </p>
            <p>
                政府投资交通水利类：<em>${a2}项</em>
            </p>
            <p>
                企业投资类：<em>${a3}项</em>
            </p>
            <p>
                土地收储类：<em>${a4}项</em>
            </p>
            <div class="updatetime">更新时间：<em></em></div>
        </div>
        <div class="project-title  text-center">重大项目开工情况</div>
        <div class="open-rate">
            <!-- 开工率饼状图 -->
            <div id="open-rate"></div>
            <span class="rate"></span>
            <ul class="chart-detail">
                <li class="lf">
                    <span>重点项目</span>
                    <span class="lookproject-1">查看详情</span>
                    <span>${dataMap['focusProject']}<em>项</em></span>
                </li>
                <li class="lf">
                    <span>计划投资</span>
                    <span>
                        <fmt:formatNumber type="number" value="${dataMap['plannedInvestment']}" maxFractionDigits="1"/>
                        <em>万元</em></span>
                </li>
                <%--<li class="lf">--%>
                <%--<span>年度投资计划</span>--%>
                <%--<span><fmt:formatNumber type="number" value="${dataMap['annualInvestmentPlan']}" maxFractionDigits="0"/>--%>
                <%--<em>亿</em></span>--%>
                <%--</li>--%>
                <div style="clear: both;"></div>
            </ul>
        </div>
        <div class="plane-project">
            <div class="small-title">计划新开工项目</div>
            <!-- 计划新开工饼状图 -->
            <div class="plan">
                <div id="plane"></div>
                <%--百分比--%>
                <span class="new-plane-rate">20.22%</span>
                <%-- <span class="lookproject-2">查看详情</span>--%>
                <div class="year-plane">
                    计划投资<em>
                    <fmt:formatNumber type="number" value="${dataMap['planeProjectAnnualPlan']}" maxFractionDigits="1"/>
                </div>
                <div class="progress-time">
                    <span class="lf">差序时进度：<em>45%</em>&nbsp;&nbsp;</span>
                    <div class="progress">
                        <div class="progress-bar progress-bar-success" role="progressbar"
                             aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
                             style="width: 40%;">
                        </div>
                        <div class="progress-bar progress-bar-info" role="progressbar"
                             aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
                             style="width: 40%;">
                        </div>
                        <div class="progress-bar progress-bar-warning" role="progressbar"
                             aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
                             style="width: 20%;">
                        </div>
                    </div>
                    <div style="clear: both;"></div>
                </div>
            </div>
            <div class="small-title">结转项目情况</div>
            <!-- 结转项目情况 -->
            <div class="plan">
                <div id="jz-project" data-type="2002"></div>
                <span class="jzproject-rate">20.22%</span>
                <%-- <span class="lookproject-1">查看详情</span>--%>
                <div class="year-plane">
                    计划投资<em>
                    <fmt:formatNumber type="number" value="${dataMap['jzProjectAnnualPlan']}" maxFractionDigits="1"/>
                </div>
                <div class="progress-time">
                    <span class="lf">差序时进度：<em>45%</em>&nbsp;&nbsp;</span>
                    <div class="progress">
                        <div class="progress-bar progress-bar-success" role="progressbar"
                             aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
                             style="width: 40%;">
                        </div>
                        <div class="progress-bar progress-bar-info" role="progressbar"
                             aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
                             style="width: 40%;">
                        </div>
                        <div class="progress-bar progress-bar-warning" role="progressbar"
                             aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
                             style="width: 20%;">
                        </div>
                    </div>
                    <div style="clear: both;"></div>
                </div>
            </div>
        </div>
    </div>
    <!-- 中间部分 -->
    <div class="main-middle lf">
        <!-- 中间上部分-各个项目情况 -->
        <div class="finish-situation">
            <div>
                <div class="middle-title  text-center">
                    各个项目完成情况
                </div>
            </div>

            <!-- Tab panes -->
            <div class="tab-content tabs part1">
                <!-- 1 工业项目 -->
                <div role="tabpanel" class="tab-pane fade in active item" id="Section1">
                </div>
                <!-- 2 交通 -->

                <div role="tabpanel" class="tab-pane fade item" id="Section2">

                </div>
                <!--3 商住项目  -->
                <div role="tabpanel" class="tab-pane fade item" id="Section3">

                </div>
                <!-- 4 安置房项目 -->
                <div role="tabpanel" class="tab-pane fade item" id="Section4">

                </div>
                <!-- 5 社会事业项目 -->
                <div role="tabpanel" class="tab-pane fade item" id="Section5">

                </div>
                <!-- 6 城建基础设施 -->
                <div role="tabpanel" class="tab-pane fade item" id="Section6">

                </div>
                <!-- 7 农林水利环保生态 -->
                <div role="tabpanel" class="tab-pane fade item" id="Section7">

                </div>
                <!-- 8 旅游特色小镇项目 -->
                <div role="tabpanel" class="tab-pane fade item" id="Section8">

                </div>
            </div>
            <!-- Nav tabs -->
            <div class="footer-bottom">
                <ul class="nav nav-tabs" role="tablist">
                    <li role="presentation" class="active">
                        <a href="#Section1" onclick="showItem1(1002,1); return false;" aria-controls="home"
                           role="tab"
                           data-toggle="tab">工业项目</a>
                    </li>
                    <li role="presentation">
                        <a href="#Section2" onclick="showItem1(1003,2); return false;" aria-controls="profile"
                           role="tab" data-toggle="tab">交通</a>
                    </li>
                    <li role="presentation">
                        <a href="#Section3" onclick="showItem1(1007,3); return false;" aria-controls="messages"
                           role="tab" data-toggle="tab">商住项目</a>
                    </li>
                    <li role="presentation">
                        <a href="#Section4" onclick="showItem1(1005,4); return false;" aria-controls="messages"
                           role="tab" data-toggle="tab">安置房项目</a>
                    </li>
                    <li role="presentation">
                        <a href="#Section5" onclick="showItem1(1006,5); return false;" aria-controls="messages"
                           role="tab" data-toggle="tab">社会事业项目</a>
                    </li>
                    <li role="presentation">
                        <a href="#Section6" onclick="showItem1(1004,6); return false;" aria-controls="messages"
                           role="tab" data-toggle="tab">城镇基础设施</a>
                    </li>
                    <li role="presentation">
                        <a href="#Section7" onclick="showItem1(1008,7); return false;" aria-controls="messages"
                           role="tab" data-toggle="tab">农林水利环保生态</a>
                    </li>
                    <li role="presentation">
                        <a href="#Section8" onclick="showItem1(1001,8); return false;" aria-controls="messages"
                           role="tab" data-toggle="tab">旅游特色小镇项目</a>
                    </li>
                </ul>
            </div>
        </div>
        <!-- 中间下部分-节点完成率-预警处理率 -->
        <div class="node-complete-rate">
            <!-- 节点完成率 柱状图表 -->
            <div class="node-rate">
                <div class="middle-bottom-title  text-center">各单位节点完成率</div>
                <div id="node-rate"></div>
            </div>
            <!--  预警处理器 柱状图表-->
            <div class="warning-rate">
                <div class="middle-bottom-title  text-center">预警信息处理率</div>
                <div id="warning-rate"></div>
            </div>
        </div>
    </div>
    <!-- 右侧边栏-重大项目行业分类-点击率排名-->
    <div class="right-side rf">
        <div class="left-title  text-center">重大项目行业分类</div>
        <!-- 重大项目行业分类 图表显示区-->
        <div id="industry-classification"></div>
        <p class="newproject">
            <em>15</em> 项
            <em>15</em> %
        </p>
        <p class="industrial">
            <em>15</em> 项
            <em>15</em> %
        </p>
        <p class="traffic">
            <em>44</em> 项
            <em>18</em> %
        </p>
        <p class="tourism">
            <em>43</em> 项
            <em>18</em> %
        </p>
        <p class="housing">
            <em>22</em> 项
            <em>21</em> %
        </p>
        <p class="social">
            <em>24</em> 项
            <em>23</em> %
        </p>
        <p class="basemeuase">
            <em>16</em> 项
            <em>16</em> %
        </p>
        <p class="agriculture">
            <em>6</em> 项
            <em style="margin-left: 20%;">5</em> %
        </p>
        <div class="left-title  text-center">重大项目点击率排名</div>
        <!-- 重大项目点击率图表显示区 -->
        <div id="clickrate"></div>
        <div class="statisticaltime">统计时间：<em>2011.11.21</em></div>
    </div>

</div>
<%--修改密码模态框--%>
<div class="modal fade" id="update-password" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
     aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel" style="font-weight: 600;">个人密码信息修改</h4>
            </div>
            <div class="modal-body">
                <form id="defaultForm" method="post" action="" class="form-horizontal">

                    <div class="form-group">
                        <label class="col-lg-3 control-label" for="username">登录账号</label>
                        <div class="col-lg-5">
                            <input type="text" id="username" readonly="readonly" class="form-control"
                                   name="username"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-lg-3 control-label" for="password">原密码</label>
                        <div class="col-lg-5">
                            <input type="text" id="password" class="form-control" name="password"/>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-lg-3 control-label" for="newPwd">新密码</label>
                        <div class="col-lg-5">
                            <input type="password" id="newPwd" class="form-control" name="newPwd"/>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-lg-3 control-label" for="reNewPwd">确认密码</label>
                        <div class="col-lg-5">
                            <input type="password" id="reNewPwd" class="form-control" name="reNewPwd"/>
                        </div>
                    </div>

                    <div class="modal-footer">
                        <button type="button" id="close-modal" class="btn btn-default" data-dismiss="modal">关闭
                        </button>
                        <button type="submit" class="btn btn-primary" id="edit">提交</button>
                    </div>
                </form>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

<script src="<s:url value="/assets/web/js/jquery.min.js?v=2.1.4"></s:url>"></script>
<script src="<s:url value="/assets/web/js/index/divscroll.js"></s:url>"></script>
<script src="<s:url value="/assets/web/js/echarts.min.js"></s:url>"></script>
<script src="<s:url value="/assets/web/js/bootstrap.min.js"></s:url>"></script>
<script src="<s:url value="/assets/web/common/bootstrapvalidator/dist/js/bootstrapValidator.js"></s:url>"></script>
<script src="<s:url value="/assets/web/js/index/index_chart.js"></s:url>"></script>

<script>
    $(function () {
        /* // 跳转到计划新开工二级页面 index2
         $(".lookproject-2").click(function(){
             window.location.href="/newlogin/goIndex2?projectType=2001";
         })*/

        //结转项目二级页面 index2
        $(".lookproject-1").click(function () {
            window.location.href = "/newlogin/goIndex2?projectType=1";
        });

        //进程报告 index3
        $(".tab-content").on("click", ".img-2", function () {
            var projectId = $(this).data("id");
            window.location.href = "/newlogin/goIndex3?projectId=" + projectId;
        });

        //项目详情 index2
        $(".part1").on("click", ".progress,.project-names", function () {
            var projectId = $(this).data("id");
            window.location.href = "/newlogin/goIndex2?sysId=" + projectId;
        });


        //获取当前时间，格式YYYY-MM-DD
        function getNowFormatDate() {
            var date = new Date();
            var seperator1 = "-";
            var year = date.getFullYear();
            var month = date.getMonth() + 1;
            var strDate = date.getDate();
            if (month >= 1 && month <= 9) {
                month = "0" + month;
            }
            if (strDate >= 0 && strDate <= 9) {
                strDate = "0" + strDate;
            }
            var currentdate = year + seperator1 + month + seperator1 + strDate;
            return currentdate;
        }

        //获取更新时间并赋值
        $(".updatetime>em").html(getNowFormatDate());
        //获取统计时间并赋值
        $(".statisticaltime>em").html(getNowFormatDate());


    })
</script>

<%--修改密码--%>
<script>
    $(function () {
        $('#defaultForm').bootstrapValidator({
            message: 'This value is not valid',
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                password: {
                    message: '密码无效',
                    validators: {
                        notEmpty: {
                            message: '原密码是必需的，不能为空'
                        },
                        stringLength: {
                            min: 6,
                            max: 30,
                            message: '原密码必须超过6个字符，长度不能超过30个字符'
                        },
                        remote: {
                            type: 'POST',   //请求方式
                            url: '/newlogin/check',
                            data: function () {
                                return {
                                    username: $("#username").val(),
                                    password: $("#password").val()
                                };
                            },
                            delay: 300,	//（默认输入一个字符，提交一次，服务器压力太大）
                            message: '原密码错误'
                        }
                    }
                },
                newPwd: {
                    validators: {
                        notEmpty: {
                            message: '新密码不能为空'
                        },
                        stringLength: {
                            min: 6,
                            max: 30,
                            message: '新密码必须超过6个字符，长度不能超过30个字符'
                        }
                    }
                },
                reNewPwd: {
                    validators: {
                        notEmpty: {
                            message: '确认密码不能为空'
                        },
                        identical: {
                            field: 'newPwd',
                            message: '确认密码及其新密码不一致'
                        },
                        stringLength: {
                            min: 6,
                            max: 30,
                            message: '确认密码必须超过6个字符，长度不能超过30个字符'
                        }
                    }
                }
            }
        });
        //清空
        $('#close-modal').click(function () {

            $('#defaultForm').data('bootstrapValidator').resetForm(true);//清理验证
        })

        //提交
        $("#edit").click(function () {
            var flag = $('#defaultForm').data("bootstrapValidator").isValid();
            // var demo = $("#defaultForm").serialize();
            var username = $("#username").val();
            var password = $("#password").val();
            var newPwd = $("#newPwd").val();
            var reNewPwd = $("#reNewPwd").val();
            if (flag) {
                $.ajax({
                    type: "post",
                    url: "/newlogin/editPwd",
                    dataType: "json",
                    data: {
                        username: username,
                        password: password,
                        newPwd: newPwd,
                        reNewPwd: reNewPwd
                    },
                    success: function (res) {
                        if (res.code == '200') {
                            if (res.data == '0') {
                                alert(res.message);
                            } else {
                                alert(res.message);
                                location.reload();
                            }
                        } else {
                            alert("未知错误");
                        }
                    }
                })
            }
        })


        /**
         * 修改密码按钮，点击事件
         */
        $("#editPwd").click(function () {
            var username = ${sessionScope.user.phone};
            $("#username").val(username);
        })
    })
</script>
</body>
</html>









